<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro"
>



<head>

    <meta charset="utf-8">
    <meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>jQuery手机端虚拟键盘代码 - 站长素材</title>

    <script th:src="@{/plug-in/adminLTE/plugins/jQuery/jquery-3.6.0.min.js}"></script>

    <link rel="stylesheet" th:href="@{/plug-in/adminLTE/virtualKeyboard/css/reset.css}">
    <link rel="stylesheet" th:href="@{/plug-in/adminLTE/virtualKeyboard/css/keyboard.css}">

    <style>
        .m{
            margin-top: 5px;
            width: 100%;
            margin-left: auto;
            margin-right: auto;
        }
        .m textarea{
            border: 1px solid #9A9A9A;line-height: 60px;width: 100%;padding-left: 10px
        }
    </style>
    <!-- 导入公有的header -->
</head>
<body>

<div class="m">
    <textarea id="keyLog" class="account" ></textarea>
</div>

<script th:src="@{/plug-in/adminLTE/virtualKeyboard/js/slide.js}"></script>
<script>
    $(document).ready(function() {
            document.activeElement.blur();  // 阻止弹出系统软键盘
            var _cliss = $('#keyLog').attr("class");
            console.log(_cliss);
            $('body').keyboard({
                defaults:'English',    //键盘显示类型   English 字母  number 数字  symbol 符号
                inputClass:_cliss,        //输入框Class
                caseSwitch:'toLowerCase', //英文大小写  toLowerCase 小写  toUpperCase 大写
            });


    });
</script>

</body>
</html>
